<template>
 <!-- 测试 -->
  <!-- <XtxSkeleton width="100" height="100" bg="red" /> -->
  <!-- <p>{{ load }}</p>
  <input type="text" v-ilazy="load" /> -->
  <!-- <div class="xtx-home-page test">
      <div class="home-entry"> -->
        <!-- <Skeleton width="100" height="100"  bg="blue"/> -->
     <div class="container">
        <!-- 左侧分类 -->
        <HomeCategory />
        <!-- banner轮播图 -->
        <HomeBanner/>
        <!-- 新鲜好物-->
        <HomeNew/>
         <!-- 人气推荐 -->
    <HomeRecom />
    <!-- 商品模块 -->
    <HomeProduct/>
    <!-- 测试
    <HomePannel title="新鲜好物" subTitle="新鲜出炉 品质靠谱">
<template #right>
    <XtxMore/>
</template>
<h1>h1</h1>
     <ul>
        <li>商品列表</li>
      </ul>
    </HomePannel> -->
      </div>
    <!-- </div>
  </div> -->
</template>

<script>
import HomeCategory from './components/home-category'
import HomeBanner from './components/home-banner'
// import Skeleton from '@/components/Skeleton'
// import HomePannel from './components/home-panel.vue'
import HomeNew from './components/home-new'
import HomeRecom from './components/home-recom.vue'
import HomeProduct from './components/home-product.vue'
export default {
  name: 'xtx-home-page',
  components: { HomeCategory, HomeBanner, HomeNew, HomeRecom, HomeProduct }
}
</script>

<style scoped lang='less'>
// 手动导入
@import "~@/styles/variables.less";
// @import "~@/styles/variables.less";
.test {
  color: @xtxColor;
}
</style>
